<template>
  <div class="set">
    <el-tabs class="tabs" :tab-position="'left'">
      <el-tab-pane label="序列设置">
        <sequence-set :idTable="idTable" @handleSuccess="handleSuccess"></sequence-set>
      </el-tab-pane>
      <el-tab-pane label="表头设置" lazy>
        <header-set :idTable="idTable" @handleSuccess="handleSuccess"></header-set>
      </el-tab-pane>
      <el-tab-pane label="检索设置" lazy>
        <retrieval-set :idTable="idTable" @handleSuccess="handleSuccess"></retrieval-set>
      </el-tab-pane>
      <el-tab-pane label="排序" lazy>
        <sort-set :idTable="idTable"></sort-set>
      </el-tab-pane>
      <!--<el-tab-pane label="路径设置">
        <link-set></link-set>
      </el-tab-pane>-->
    </el-tabs>
  </div>
</template>

<script>
import HeaderSet from './set/headerSet'
import SequenceSet from './set/sequenceSet'
import SortSet from './set/sortSet'
import RetrievalSet from './set/retrievalSet'
// import LinkSet from './set/linkSet'
export default {
  name: 'setUp',
  props: {
    idTable: {
      type: String
    }
  },
  components: {
    // LinkSet,
    RetrievalSet,
    SortSet,
    SequenceSet,
    HeaderSet
  },
  data () {
    return {}
  },
  methods: {
    handleSuccess () {
      this.$emit('handleSuccess')
    }
  }
}
</script>

<style lang="scss" scoped>
  .set {
    padding: 10px 20px;
    display: flex;
    justify-content: space-between;
    background: #e7e7e7;
    height: 100%;

    .tabs {
      background: #fff;
      width: 100%;
      border-radius: 5px;
    }
  }
</style>
